<%@ page contentType="text/html;charset=UTF-8" language="java"%>
<%@ include file="/WEB-INF/jsp/common/_includes.jsp" %>
<%@ page contentType="text/html;charset=UTF-8" language="java"%>
<jsp:include page="/WEB-INF/jsp/common/_head.jsp"/>
<div class="ui grid">
	<div class="row">
		<div class="column">
			<div class="ui two column grid">
				<div class="three wide column">
					<jsp:include page="/WEB-INF/jsp/common/_sidebar.jsp">
						<jsp:param name="index" value="201"/>
					</jsp:include>
				</div>
				<div id="container" class="thirteen wide column">
					<ol class="breadcrumb">
						<li><a href="/">后台管理</a></li>
						<li class="active">房间列表</li>
					</ol>
                    <a class="btn btn-${empty param.status || param.status == -1 ? 'success':'default'}" value="-1" href="/room">全部</a>
                    <a class="btn btn-${param.status == 0 ? 'success' :'default'}"  href="?status=0">待审核</a>
                    <a class="btn btn-${param.status == 1 ? 'success' :'default'}"  href="?status=1">审核通过</a>
                    <a class="btn btn-${param.status == 2 ? 'success' :'default'}"  href="?status=2">审核未通过</a>
                    <a class="btn btn-${param.status == 3 ? 'success' :'default'}"  href="?status=3">内部推广</a>
					<table class="table table-hover">
						<thead>
						<tr>
                            <c:if test="${param.status == 1}">
                               <th> <input type="checkbox" name="checkAll" />  </th>
                            </c:if>
							<th>ID</th>
							<th>房间</th>
                            <th>分类</th>
                            <th>类型</th>
                            <th>可见类型</th>
							<th>申请人</th>
							<th>申请时间</th>
							<th>审核状态</th>
							<th>房间显示状态</th>
							<th>操作</th>
						</tr>
						</thead>
						<tbody>
						<c:forEach items="${paginate.pageList}" var="room">
							<tr data-id="${room.id }">
                                <c:if test="${param.status == 1}">
                                 <td><input type="checkbox" /></td>
                                </c:if>
								<td>${room.id}</td>
								<td><a href="javascript:;" class="js_room" data-id="${room.id }">${room.name}</a></td>
                                <td>${room.categoryStr}</td>
                                <td>${room.typeStr}</td>
                                <td>
                                    <c:choose>
                                        <c:when test="${room.visible == 0}">
                                            全部可见
                                        </c:when>
                                        <c:when test="${room.visible == 1}">
                                            游客不可见
                                        </c:when>
                                    </c:choose>
                                </td>
								<td>${room.nickName}</td>
								<td><fmt:formatDate value="${room.createdTime}"/></td>
								<td>${room.statusStr}</td>
								<td>
                                    <c:choose>
                                        <c:when test="${room.enable}">
                                          正常
                                        </c:when>
                                        <c:when test="${!room.enable}">
                                          已关闭
                                        </c:when>
                                    </c:choose>
                                </td>
								<td>
                                    <%--<a class="btn active btn-primary" href="/room/${room.id}/details" arget="_blank">详情</a>--%>
                                    <c:choose>
                                        <c:when test="${room.status == 0}">
                                            <a class="btn active btn-success" isAudit="true"  label="确认通过？" title="房间认证" ref="/room/${room.id}/audit" href="javaScript:;">通过</a>
                                            <a class="btn active btn-warning"  isAudit="false" label="确认通过？" title="房间认证" ref="/room/${room.id}/audit" href="javaScript:;">不通过</a>
                                        </c:when>
                                        <c:when test="${room.status == 1}">
                                            <c:choose>
                                                <c:when test="${room.enable}">
                                                    <a class="btn btn-info js_broadcast" data-id="${room.id }" data-loading-text="发送中">广播</a>
                                                    <a class="btn active btn-danger"  isAudit="false" label="确认关闭？" title="房间设置" ref="/room/${room.id}/setEnable/0" href="javaScript:;">关闭</a>
                                                    <c:choose>
	                                                    <c:when test="${room.internal}">
		                                                    <a class="btn btn-info js_internal" label="确认取消？" title="内部推广设置"  ref="/room/${room.id}/setInternal/0"  data-loading-text="设置中">取消内部推广</a>
	                                                    </c:when>
	                                                    <c:otherwise>
		                                                    <a class="btn btn-info js_internal" label="确认设置为内部推广房间？" title="内部推广设置"  ref="/room/${room.id}/setInternal/1" data-loading-text="设置中">设置为内部推广</a>
	                                                    </c:otherwise>
                                                    </c:choose>
                                                </c:when>
                                                <c:when test="${!room.enable}">
                                                    <a class="btn active btn-success"  isAudit="false" label="确认开启？" title="房间设置" ref="/room/${room.id}/setEnable/1" href="javaScript:;">开启</a>
                                                </c:when>
                                            </c:choose>
                                        </c:when>
                                    </c:choose>
								</td>
							</tr>
						</c:forEach>
						</tbody>
					</table>
                    <c:if test="${param.status == 1}">
                        <div class="ui">
                            <div class="ui green mini button js_batch_media">群发广播</div>
                        </div>
                    </c:if>
                    <div class="page-info clearfix">
                        <jsp:include page="/WEB-INF/jsp/common/_page.jsp"/>
                    </div>
				</div>
			</div>
		</div>
	</div>
</div>
<jsp:include page="/WEB-INF/jsp/common/_foot.jsp"></jsp:include>
<script type="text/javascript" src="/static/js/room-list.js"></script>
<script type="text/javascript" >
	$(function(){
		$('a.btn-success,a.btn-danger,a.btn-warning,a.js_internal').click(function(){
			var obj = $(this);
			var isAudit = obj.attr("isAudit");
			var title = obj.attr("title");
			var label = obj.attr("label");
			Confirm(title, label, function(){
				$('#js_submit').button('loading');
				$.post(obj.attr("ref"), {isAudit:isAudit}, function(res){
					$('#js_submit').button('reset');
					if(res.status == 'ok'){
						success(res.message);
						setTimeout(window.location.reload(),5000);
					}else{
						error(res.message);
						setTimeout(window.location.reload(),5000);
					}
				});
			});
		});
		
		$('.js_room').qtip({
			content: {
				title: function(event, o){
					return $(event.target).text();
				},
				text: function(event, o){
					return '<iframe width="480" height="360" frameborder="0" scrolling="no" src="' + global.front_url + '/room/preview/' + $(event.target).data('id') + '"></iframe>';
				},
				button: true
			},
			show: {
				event: 'click'
			},
			hide: {
				event: 'unfocus'
			},
			style : {
				classes : 'qtip-preview',
				tip : false
			},
			position: {
				my: 'center', at: 'center',
				target : $(window)
			}
		});
		
		$('.js_broadcast2').qtip({
			content: {
				title: '广播',
				text: '<div class="mt5"><textarea name="content"/></div>\
						<div class="mt5 clearfix"><button class="js_send pull-right" data-loading-text="发送中...">发送</button></div>'
				,button: true
			},
			show: {
				event: 'click',
				modal : {
					on : true,
					blur : true
				}
			},
			hide: {
				event: 'unfocus'
			},
			style: {
				classes : 'qtip-broadcast qtip-light'
			},
			position: {
				my: 'center', at: 'center',
				target : $(window)
			},
			events: {
				render: function(event, api){
					$('button', api.elements.content).click(function(e) {
						var roomId = $(api.elements.target).data('id'),
							content = $('textarea', api.elements.content).val(),
							self = $(this);
						if(content.trim() == ''){
							return;
						}
						self.button('loading');
						sendMessage(content, roomId, function(data){
							$.post('/message/send', {
								content: content,
								roomId: roomId
							}, function(res){
								if(res.status == 'ok'){
									$('textarea', api.elements.content).val('')
									self.button('reset');
									api.hide();
								}
							});
						});
						
					});
				}
			}
		});
		
		$('.js_batch_media').click(function(){
			if($('input[type=checkbox]:checked').length == 0){
				Confirm('提示', '您尚未选择房间，是否发送全局消息？', function(){
					qtip.qtip('show');
				});
			}else {
				qtip.qtip('show');
			}
		});
		
		var qtip = $('<div/>').qtip({
			content: {
				title: '群发广播',
				text: '<div class="mt5"><textarea name="content"/></div>\
						<div class="mt5 clearfix"><button class="js_send pull-right" data-loading-text="发送中...">发送</button></div>',
				button: true
			},
			show: {
				event: 'click',
				modal : {
					on : true,
					blur : true
				}
			},
			hide: {
				event: 'unfocus'
			},
			style: {
				classes : 'qtip-broadcast qtip-light'
			},
			position: {
				my: 'center', at: 'center',
				target : $(window)
			},
			events: {
				render: function(event, api){
					$('button', api.elements.content).click(function(e) {
						var content = $('textarea', api.elements.content).val(),
							self = $(this);
						if(content.trim() == ''){
							return;
						}
						self.button('loading');
						
						var ids = [];
						$.each($('input[type=checkbox]:checked'), function(i, input){
							ids.push($(input).closest('tr').data('id'));
						});
						
						sendMessage(content, function(data){
							$.post('/message/send', {
								content: content,
								roomId: ids.length > 0 ? ids.join('_') : null
							}, function(res){
								if(res.status == 'ok'){
									$('textarea', api.elements.content).val('')
									self.button('reset');
									api.hide();
								}
							});
						});
						
					});
				}
			}
		});
		
		$('input[name=checkAll]').click(function(){
			if($(this).is(':checked')){
				$('tbody input[type=checkbox]').attr("checked",'checked');
			}else{
				$('tbody input[type=checkbox]').attr("checked",false);
			}
		});
	});
</script>

